<template>
  <TableView
    ref="tableView"
    :table-attrs="{
      api: getPage,
      payloadStyle: 'body',
      pageSize: 10,
    ascs: ['orderNo'],
                    dicOptions: [{ prop: 'status', dicType: 'work_item_status' }] }"
    :form-path="`/workItem/WorkItemForm/${formId}/{id:-1}`"
    :search-model="searchForm"
    :delete-api="batchDelete"
    :toolbar-attrs="{ buttons: ['slot', { del: 'workItem_workitem_del', create: true }] }">
    <template #toolbar-button="{ selectedRows }">
      <!-- 自定义按钮 -->
    </template>
    <template #columns>
      <TableColumn label="状态" prop="status"/>
      <TableColumn label="事项名称" prop="subject"/>
      <TableColumn label="紧急程度" prop="level">
        <template #default="{ row }">
          <ElTag v-if="row.level === '高'" type="danger" >{{ row.level }}</ElTag>
          <ElTag v-if="row.level === '中'" type="warning">{{ row.level }}</ElTag>
          <ElTag v-if="row.level === '低'" type="success">{{ row.level }}</ElTag>
        </template>
      </TableColumn>
      <TableColumn label="处理人" prop="assignedName"/>
      <TableColumn label="排序" prop="orderNo"/>
      <TableColumn label="事项说明" prop="description"/>
    </template>
    <template #search-form>
      <FormSelect v-model="searchForm.status" dict-type="work_item_status" label="状态" prop="status" style="width: 220px;"  />
      <FormInput v-model="searchForm.subject"  label="事项名称" prop="subject" style="width: 220px;"  />
      <FormSelect v-model="searchForm.level" dict-type="work_item_level_type" label="状态" prop="subject" style="width: 220px;"  />
      <FormInput v-model="searchForm.assignedName"  label="处理人" prop="assignedName" style="width: 220px;"  />
      <FormInput v-model="searchForm.description"  label="事项说明" prop="description" style="width: 220px;"  />
    </template>
  </TableView>
</template>

<script>
import {mapState} from 'vuex'
import {services} from '@/config'
import {getPage, batchDelete} from '@/api/workItem/workItem.js'

export default {
  name: 'WorkItem',
  props: {
    formId: {
      type: String,
      default: '-1'
    }
  },
  data() {
    return {
      searchForm: {
        id: '',
        createId: '',
        createBy: '',
        createTime: '',
        deptId: '',
        deptFullname: '',
        updateBy: '',
        updateTime: '',
        status: '',
        formId: this.formId,
        subject: '',
        description: '',
        level: '',
        assignedName: '',
        parentId: ''
      }
    }
  },
  computed: {
    services() {
      return services
    },
    ...mapState('user', ['permissions'])
  },
  created() {
    this.searchForm.formId = this.formId
  },
  methods: {
    getPage,
    batchDelete,
    //  导出excel
    exportExcel() {
      this.$downBlobFile(`${services.assetService}workItem/export`, this.searchForm, 'workItem.xlsx')
    }
  }
}
</script>
